<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="名称" prop="name">
        <el-input
          v-model="queryParams.name"
          placeholder="请输入名称"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="图片" prop="profilePicture">
        <el-input
          v-model="queryParams.profilePicture"
          placeholder="请输入图片"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="兵力初值" prop="troops">
        <el-input
          v-model="queryParams.troops"
          placeholder="请输入兵力初值"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="兵力上限" prop="troopsLimit">
        <el-input
          v-model="queryParams.troopsLimit"
          placeholder="请输入兵力上限"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="精力初值" prop="energy">
        <el-input
          v-model="queryParams.energy"
          placeholder="请输入精力初值"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="精力上限" prop="energyLimit">
        <el-input
          v-model="queryParams.energyLimit"
          placeholder="请输入精力上限"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="攻击初值" prop="attack">
        <el-input
          v-model="queryParams.attack"
          placeholder="请输入攻击初值"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="攻击上限" prop="attackLimit">
        <el-input
          v-model="queryParams.attackLimit"
          placeholder="请输入攻击上限"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="速度初值" prop="speed">
        <el-input
          v-model="queryParams.speed"
          placeholder="请输入速度初值"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="速度上限" prop="speedLimit">
        <el-input
          v-model="queryParams.speedLimit"
          placeholder="请输入速度上限"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="抗物理初值" prop="antiPhysics">
        <el-input
          v-model="queryParams.antiPhysics"
          placeholder="请输入抗物理初值"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="抗物理上限" prop="antiPhysicsLimit">
        <el-input
          v-model="queryParams.antiPhysicsLimit"
          placeholder="请输入抗物理上限"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="抗玄击初值" prop="antiXuanStrike">
        <el-input
          v-model="queryParams.antiXuanStrike"
          placeholder="请输入抗玄击初值"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="抗玄击上限" prop="antiXuanStrikeLimit">
        <el-input
          v-model="queryParams.antiXuanStrikeLimit"
          placeholder="请输入抗玄击上限"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="抗封锁初值" prop="antiBlocking">
        <el-input
          v-model="queryParams.antiBlocking"
          placeholder="请输入抗封锁初值"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="抗封锁上限" prop="antiBlockingLimit">
        <el-input
          v-model="queryParams.antiBlockingLimit"
          placeholder="请输入抗封锁上限"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="抗扰乱初值" prop="antiDisturbance">
        <el-input
          v-model="queryParams.antiDisturbance"
          placeholder="请输入抗扰乱初值"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="抗扰乱上限" prop="antiDisturbanceLimit">
        <el-input
          v-model="queryParams.antiDisturbanceLimit"
          placeholder="请输入抗扰乱上限"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="抗围困初值" prop="antiSiege">
        <el-input
          v-model="queryParams.antiSiege"
          placeholder="请输入抗围困初值"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="抗围困上限" prop="antiSiegeLimit">
        <el-input
          v-model="queryParams.antiSiegeLimit"
          placeholder="请输入抗围困上限"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="抗风沙初值" prop="antiWind">
        <el-input
          v-model="queryParams.antiWind"
          placeholder="请输入抗风沙初值"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="抗风沙上限" prop="antiWindLimit">
        <el-input
          v-model="queryParams.antiWindLimit"
          placeholder="请输入抗风沙上限"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="抗妖火初值" prop="antiFire">
        <el-input
          v-model="queryParams.antiFire"
          placeholder="请输入抗妖火初值"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="抗妖火上限" prop="antiFireLimit">
        <el-input
          v-model="queryParams.antiFireLimit"
          placeholder="请输入抗妖火上限"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="抗毒术初值" prop="antiToxic">
        <el-input
          v-model="queryParams.antiToxic"
          placeholder="请输入抗毒术初值"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="抗毒术上限" prop="antiToxicLimit">
        <el-input
          v-model="queryParams.antiToxicLimit"
          placeholder="请输入抗毒术上限"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="抗落雷初值" prop="antiLightning">
        <el-input
          v-model="queryParams.antiLightning"
          placeholder="请输入抗落雷初值"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="抗落雷上限" prop="antiLightningLimit">
        <el-input
          v-model="queryParams.antiLightningLimit"
          placeholder="请输入抗落雷上限"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['system:WarHorsePresets:add']"
        >新增</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
          v-hasPermi="['system:WarHorsePresets:edit']"
        >修改</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="danger"
          plain
          icon="el-icon-delete"
          size="mini"
          :disabled="multiple"
          @click="handleDelete"
          v-hasPermi="['system:WarHorsePresets:remove']"
        >删除</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
          v-hasPermi="['system:WarHorsePresets:export']"
        >导出</el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

    <el-table v-loading="loading" :data="WarHorsePresetsList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="ID" align="center" prop="id" />
      <el-table-column label="名称" align="center" prop="name" />
      <el-table-column label="图片" align="center" prop="profilePicture" />
      <el-table-column label="兵力初值" align="center" prop="troops" />
      <el-table-column label="兵力上限" align="center" prop="troopsLimit" />
      <el-table-column label="精力初值" align="center" prop="energy" />
      <el-table-column label="精力上限" align="center" prop="energyLimit" />
      <el-table-column label="攻击初值" align="center" prop="attack" />
      <el-table-column label="攻击上限" align="center" prop="attackLimit" />
      <el-table-column label="速度初值" align="center" prop="speed" />
      <el-table-column label="速度上限" align="center" prop="speedLimit" />
      <el-table-column label="抗物理初值" align="center" prop="antiPhysics" />
      <el-table-column label="抗物理上限" align="center" prop="antiPhysicsLimit" />
      <el-table-column label="抗玄击初值" align="center" prop="antiXuanStrike" />
      <el-table-column label="抗玄击上限" align="center" prop="antiXuanStrikeLimit" />
      <el-table-column label="抗封锁初值" align="center" prop="antiBlocking" />
      <el-table-column label="抗封锁上限" align="center" prop="antiBlockingLimit" />
      <el-table-column label="抗扰乱初值" align="center" prop="antiDisturbance" />
      <el-table-column label="抗扰乱上限" align="center" prop="antiDisturbanceLimit" />
      <el-table-column label="抗围困初值" align="center" prop="antiSiege" />
      <el-table-column label="抗围困上限" align="center" prop="antiSiegeLimit" />
      <el-table-column label="抗风沙初值" align="center" prop="antiWind" />
      <el-table-column label="抗风沙上限" align="center" prop="antiWindLimit" />
      <el-table-column label="抗妖火初值" align="center" prop="antiFire" />
      <el-table-column label="抗妖火上限" align="center" prop="antiFireLimit" />
      <el-table-column label="抗毒术初值" align="center" prop="antiToxic" />
      <el-table-column label="抗毒术上限" align="center" prop="antiToxicLimit" />
      <el-table-column label="抗落雷初值" align="center" prop="antiLightning" />
      <el-table-column label="抗落雷上限" align="center" prop="antiLightningLimit" />
      <el-table-column label="介绍" align="center" prop="biography" />
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
            v-hasPermi="['system:WarHorsePresets:edit']"
          >修改</el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['system:WarHorsePresets:remove']"
          >删除</el-button>
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

    <!-- 添加或修改战马预设对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="名称" prop="name">
          <el-input v-model="form.name" placeholder="请输入名称" />
        </el-form-item>
        <el-form-item label="图片" prop="profilePicture">
          <el-input v-model="form.profilePicture" placeholder="请输入图片" />
        </el-form-item>
        <el-form-item label="兵力初值" prop="troops">
          <el-input v-model="form.troops" placeholder="请输入兵力初值" />
        </el-form-item>
        <el-form-item label="兵力上限" prop="troopsLimit">
          <el-input v-model="form.troopsLimit" placeholder="请输入兵力上限" />
        </el-form-item>
        <el-form-item label="精力初值" prop="energy">
          <el-input v-model="form.energy" placeholder="请输入精力初值" />
        </el-form-item>
        <el-form-item label="精力上限" prop="energyLimit">
          <el-input v-model="form.energyLimit" placeholder="请输入精力上限" />
        </el-form-item>
        <el-form-item label="攻击初值" prop="attack">
          <el-input v-model="form.attack" placeholder="请输入攻击初值" />
        </el-form-item>
        <el-form-item label="攻击上限" prop="attackLimit">
          <el-input v-model="form.attackLimit" placeholder="请输入攻击上限" />
        </el-form-item>
        <el-form-item label="速度初值" prop="speed">
          <el-input v-model="form.speed" placeholder="请输入速度初值" />
        </el-form-item>
        <el-form-item label="速度上限" prop="speedLimit">
          <el-input v-model="form.speedLimit" placeholder="请输入速度上限" />
        </el-form-item>
        <el-form-item label="抗物理初值" prop="antiPhysics">
          <el-input v-model="form.antiPhysics" placeholder="请输入抗物理初值" />
        </el-form-item>
        <el-form-item label="抗物理上限" prop="antiPhysicsLimit">
          <el-input v-model="form.antiPhysicsLimit" placeholder="请输入抗物理上限" />
        </el-form-item>
        <el-form-item label="抗玄击初值" prop="antiXuanStrike">
          <el-input v-model="form.antiXuanStrike" placeholder="请输入抗玄击初值" />
        </el-form-item>
        <el-form-item label="抗玄击上限" prop="antiXuanStrikeLimit">
          <el-input v-model="form.antiXuanStrikeLimit" placeholder="请输入抗玄击上限" />
        </el-form-item>
        <el-form-item label="抗封锁初值" prop="antiBlocking">
          <el-input v-model="form.antiBlocking" placeholder="请输入抗封锁初值" />
        </el-form-item>
        <el-form-item label="抗封锁上限" prop="antiBlockingLimit">
          <el-input v-model="form.antiBlockingLimit" placeholder="请输入抗封锁上限" />
        </el-form-item>
        <el-form-item label="抗扰乱初值" prop="antiDisturbance">
          <el-input v-model="form.antiDisturbance" placeholder="请输入抗扰乱初值" />
        </el-form-item>
        <el-form-item label="抗扰乱上限" prop="antiDisturbanceLimit">
          <el-input v-model="form.antiDisturbanceLimit" placeholder="请输入抗扰乱上限" />
        </el-form-item>
        <el-form-item label="抗围困初值" prop="antiSiege">
          <el-input v-model="form.antiSiege" placeholder="请输入抗围困初值" />
        </el-form-item>
        <el-form-item label="抗围困上限" prop="antiSiegeLimit">
          <el-input v-model="form.antiSiegeLimit" placeholder="请输入抗围困上限" />
        </el-form-item>
        <el-form-item label="抗风沙初值" prop="antiWind">
          <el-input v-model="form.antiWind" placeholder="请输入抗风沙初值" />
        </el-form-item>
        <el-form-item label="抗风沙上限" prop="antiWindLimit">
          <el-input v-model="form.antiWindLimit" placeholder="请输入抗风沙上限" />
        </el-form-item>
        <el-form-item label="抗妖火初值" prop="antiFire">
          <el-input v-model="form.antiFire" placeholder="请输入抗妖火初值" />
        </el-form-item>
        <el-form-item label="抗妖火上限" prop="antiFireLimit">
          <el-input v-model="form.antiFireLimit" placeholder="请输入抗妖火上限" />
        </el-form-item>
        <el-form-item label="抗毒术初值" prop="antiToxic">
          <el-input v-model="form.antiToxic" placeholder="请输入抗毒术初值" />
        </el-form-item>
        <el-form-item label="抗毒术上限" prop="antiToxicLimit">
          <el-input v-model="form.antiToxicLimit" placeholder="请输入抗毒术上限" />
        </el-form-item>
        <el-form-item label="抗落雷初值" prop="antiLightning">
          <el-input v-model="form.antiLightning" placeholder="请输入抗落雷初值" />
        </el-form-item>
        <el-form-item label="抗落雷上限" prop="antiLightningLimit">
          <el-input v-model="form.antiLightningLimit" placeholder="请输入抗落雷上限" />
        </el-form-item>
        <el-form-item label="介绍" prop="biography">
          <el-input v-model="form.biography" type="textarea" placeholder="请输入内容" />
        </el-form-item>
        <el-form-item label="删除标志" prop="delFlag">
          <el-input v-model="form.delFlag" placeholder="请输入删除标志" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { listWarHorsePresets, getWarHorsePresets, delWarHorsePresets, addWarHorsePresets, updateWarHorsePresets } from "@/api/system/WarHorsePresets"

export default {
  name: "WarHorsePresets",
  data() {
    return {
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 战马预设表格数据
      WarHorsePresetsList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        name: null,
        profilePicture: null,
        troops: null,
        troopsLimit: null,
        energy: null,
        energyLimit: null,
        attack: null,
        attackLimit: null,
        speed: null,
        speedLimit: null,
        antiPhysics: null,
        antiPhysicsLimit: null,
        antiXuanStrike: null,
        antiXuanStrikeLimit: null,
        antiBlocking: null,
        antiBlockingLimit: null,
        antiDisturbance: null,
        antiDisturbanceLimit: null,
        antiSiege: null,
        antiSiegeLimit: null,
        antiWind: null,
        antiWindLimit: null,
        antiFire: null,
        antiFireLimit: null,
        antiToxic: null,
        antiToxicLimit: null,
        antiLightning: null,
        antiLightningLimit: null,
        biography: null,
      },
      // 表单参数
      form: {},
      // 表单校验
      rules: {
        name: [
          { required: true, message: "名称不能为空", trigger: "blur" }
        ],
        profilePicture: [
          { required: true, message: "图片不能为空", trigger: "blur" }
        ],
      }
    }
  },
  created() {
    this.getList()
  },
  methods: {
    /** 查询战马预设列表 */
    getList() {
      this.loading = true
      listWarHorsePresets(this.queryParams).then(response => {
        this.WarHorsePresetsList = response.rows
        this.total = response.total
        this.loading = false
      })
    },
    // 取消按钮
    cancel() {
      this.open = false
      this.reset()
    },
    // 表单重置
    reset() {
      this.form = {
        id: null,
        name: null,
        profilePicture: null,
        troops: null,
        troopsLimit: null,
        energy: null,
        energyLimit: null,
        attack: null,
        attackLimit: null,
        speed: null,
        speedLimit: null,
        antiPhysics: null,
        antiPhysicsLimit: null,
        antiXuanStrike: null,
        antiXuanStrikeLimit: null,
        antiBlocking: null,
        antiBlockingLimit: null,
        antiDisturbance: null,
        antiDisturbanceLimit: null,
        antiSiege: null,
        antiSiegeLimit: null,
        antiWind: null,
        antiWindLimit: null,
        antiFire: null,
        antiFireLimit: null,
        antiToxic: null,
        antiToxicLimit: null,
        antiLightning: null,
        antiLightningLimit: null,
        biography: null,
        delFlag: null
      }
      this.resetForm("form")
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1
      this.getList()
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm")
      this.handleQuery()
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.id)
      this.single = selection.length!==1
      this.multiple = !selection.length
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset()
      this.open = true
      this.title = "添加战马预设"
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset()
      const id = row.id || this.ids
      getWarHorsePresets(id).then(response => {
        this.form = response.data
        this.open = true
        this.title = "修改战马预设"
      })
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.form.id != null) {
            updateWarHorsePresets(this.form).then(response => {
              this.$modal.msgSuccess("修改成功")
              this.open = false
              this.getList()
            })
          } else {
            addWarHorsePresets(this.form).then(response => {
              this.$modal.msgSuccess("新增成功")
              this.open = false
              this.getList()
            })
          }
        }
      })
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const ids = row.id || this.ids
      this.$modal.confirm('是否确认删除战马预设编号为"' + ids + '"的数据项？').then(function() {
        return delWarHorsePresets(ids)
      }).then(() => {
        this.getList()
        this.$modal.msgSuccess("删除成功")
      }).catch(() => {})
    },
    /** 导出按钮操作 */
    handleExport() {
      this.download('system/WarHorsePresets/export', {
        ...this.queryParams
      }, `WarHorsePresets_${new Date().getTime()}.xlsx`)
    }
  }
}
</script>
